<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="format-detection" content="email=no" />
    <meta name="format-detection" content="address=no" />
    <meta name="format-detection" content="date=no" />
    <title>分享</title>
    <link href="../css/api.css" rel="stylesheet" type="text/css">
    <link href="../css/aui.css" rel="stylesheet" type="text/css">
    <link href="../css/index.css" rel="stylesheet" type="text/css">
    <link href="../css/public_win.css" rel="stylesheet" type="text/css">
    <link href="../css/public.css" rel="stylesheet" type="text/css">
    <style>
        html,
        body {
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0)
        }

        .alert_bg {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
        }

        .share_alert {
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            height: 10.25rem;
            animation: moveBody 0.5s;
            background: #fff;
        }

        @keyframes moveBody {
            from {
                bottom: -10.25rem;
            }
            to {
                bottom: 0rem;
            }
        }

        @-webkit-keyframes moveBody {
            from {
                bottom: -10.25rem;
            }
            to {
                bottom: 0rem;
            }
        }

        .share_alert .share_title {
            padding-top: 0.9rem;
            font-size: 0.7rem;
            color: rgba(101, 101, 102, 1);
            line-height: 0.9rem;
            text-align: center;
        }

        .share_alert .share_list {
            display: flex;
            padding: 0.75rem;
        }

        .share_alert .share_list .share_item {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            flex: 1;
        }

        .share_alert .share_list .share_item img {
            width: 2.5rem;
            height: 2.5rem;
        }

        .share_alert .share_list .share_item span {
            font-size: 0.7rem;
            color: rgba(81, 81, 86, 1);
            line-height: 1rem;
            padding: 0.5rem 0;
        }

        .share_alert .cancel {
            width: 100%;
            height: 2.5rem;
            line-height: 2.5rem;
            text-align: center;
            font-size: 0.8rem;
            color: rgba(34, 34, 36, 1);
        }
    </style>
</head>

<body>
    <div class="vueApp" v-cloak>

        <div class="alert_bg">
            <div class="alert_bg" tapmode @click="fnBack()"></div>
            <div class="share_alert">
                <p class="share_title">分享到</p>
                <div class="share_list">
                    <div onclick="fnSharePage(1)" class="share_item">
                        <img src="../image/wx.png" alt="">
                        <span>微信</span>
                    </div>
                    <div onclick="fnSharePage(2)" class="share_item">
                        <img src="../image/pyq.png" alt="">
                        <span>朋友圈</span>
                    </div>
                    <div class="share_item" v-if="type == 2 && ((scope == 3 && point != 0) || shareGoods == 1 || from == 'karaoke')" @click="shareToClass">
                        <img src="../image/class.png" alt="">
                        <span>班级</span>
                    </div>
                </div>
                <div class="cancel public_line_top" tapmode onclick="fnBack()">关闭</div>
            </div>
        </div>
    </div>
</body>

<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/vue.min.js"></script>
<script type="text/javascript" src="../script/service/service-app.js"></script>
<script type="text/javascript" src="../script/service/service-tool.js"></script>
<script type="text/javascript" src="../script/service/service-font.js"></script>
<script type="text/javascript" src="../script/service/service-user.js"></script>
<script type="text/javascript" src="../script/service/service-login.js"></script>
<script type="text/javascript" src="../script/service/service-share.js"></script>
<script type="text/javascript" src="../script/service/service-verify.js"></script>
<script type="text/javascript">
    var USER;
    var $S;
    var oSHARE;
    var vm;
    var pageParam;
    apiready = function() {
        USER = USER();
        $S = SERVICE();
        oSHARE = new SHARE();
        console.log(JSON.stringify(api.pageParam) + '=====pageParam');
        pageParam = api.pageParam;
        fnInit();
    }

    function fnInit() {
        vm = new Vue({
            el: ".vueApp",
            data: {
                type: getUserType(),
                scope: pageParam.scope,
                point: pageParam.point,
                from: pageParam.from,
                businessId: pageParam.businessId || "",
                shareGoods: pageParam.shareGoods || '',
                shareType: pageParam.shareType || "",
                shareTitle: pageParam.shareTitle || "朗文英语世界",
                sharePage: pageParam.sharePage || "",
                shareContent: pageParam.shareContent || "朗文英语世界",
                thumb: pageParam.thumb || "http://langwen.oss-cn-beijing.aliyuncs.com/banckground/32b09b13484e445293dfcb38726748d2.png",
            }
        });
    }

    function shareToClass() {
        fnOpenPublicWin('选择班级','class/select_class', {
            businessId: pageParam.businessId,
            shareGoods: pageParam.shareGoods,
            from: pageParam.from,
            buss: pageParam.buss
        });
        api.closeFrame();
    }

    function fnBack() {
        api.closeFrame();
    }

    function fnSharePage(pType) { //1：微信好友 2：微信朋友圈 3：qq好友 4：qq空间 5：新浪微博
        var contentUrl = _baseIp + "/static/share/" + vm.sharePage + ".html?id=" + vm.businessId;
        if(vm.shareType == 'karaoke') {
            contentUrl = _baseIp + "/static/share/" + vm.sharePage + ".html?url=" + pageParam.url;
        }else if(pageParam.shareGoods == 1) {
            contentUrl = 'http://52.80.15.168:8087/langwen/#/pages/langwen/detail?id='+ vm.businessId
        }
        var tShareData = {
            title: vm.shareTitle,
            description: vm.shareContent,
            text: vm.shareContent,
            shareType: pType,
            thumb: vm.thumb,
            contentUrl: contentUrl,
            thumbIsNet: true,
            thumbLocalSavePath: 'fs://share/shares',
        };
        oSHARE.fnShareWebPage(tShareData, function(ret, err) {
            if (ret.status) {
                fnToast("分享成功");
                fnShareSuccess();
            }
        });
    };

    // 分享成功
    function fnShareSuccess() {
        
    }
</script>

</html>
